<template>
  <homeHeaders @handleClickChange="handleClickSearch" />
  <homeList />
  <homeMain ref="changeTitle" />
</template>

<script>
import { defineComponent, ref } from 'vue'
import homeList from '@/components/homeContent/homeList.vue'
import homeHeaders from '@/components/homeContent/homeHeaders.vue'
import homeMain from '@/components/homeContent/homeMain.vue'
export default defineComponent({
  components: {
    homeList,
    homeHeaders,
    homeMain
  },
  setup() {
    const changeTitle = ref()
    function handleClickSearch() {
      changeTitle.value.updateCity()
    }
    return {
      changeTitle,
      handleClickSearch
    }
  }
})
</script>

<style lang="scss">
#app {
  display: flex;
  flex-direction: column;
  padding: 0px;
}
</style>
